/**
 * Created by xiewei on 11/13/15.
 * nav导航效果 页面切换效果
 */
/**
 * define
 */
//menu切换
var nav = $('.navbar-fixed-top');//头部固定导航
var menu = $('.left-hide-menu');//左侧隐藏菜单
var main = $('.main-mobile');//移动端页面主体
var ifFolded = true;//是否折叠 初始默认折叠

var detailScroll = $('.detail div.scroll');
var detailBigImg = $('.detail span.bigImg');
/**
 * 获取屏幕宽度
 * @returns {Number}
 */
var getPageWidth = function(){
    return document.documentElement.clientWidth ? document.documentElement.clientWidth:document.body.clientWidth;
}
/**
 * 获取屏幕宽高度
 * @returns {Number}
 */
var getPageHeight = function(){
    return document.documentElement.clientHeight ? document.documentElement.clientHeight:document.body.clientHeight;
}
/**
 * 移动端 视频点击播放\暂停
 */
var videoControl = function(){
    var steps = $('.how-to-foster ul').find('a.step');
    var videos = steps.children('video');
    //通用播放
    var play = function(video,icon){
        video[0].play();
        video.removeClass('stop');
        icon.hide();
    }
    //通用暂停
    var pause = function(video,icon){
        video[0].pause();
        video.addClass('stop');
        icon.show();
    }
    videos.each(function(){
        var video = $(this);
        var icon = $(this).next();
        //视频的点击播放事件
        video.on('click',function(){
            if(video.hasClass('stop')){
                play(video,icon);
                //视频播放结束后复原 显示暂停图标
                var videoTimer = setInterval(function(){
                    if(video[0].paused || video[0].ended){
                        video.addClass('stop');
                        icon.show();
                        clearInterval(videoTimer);
                    }
                },1000);
            }else{
                pause(video,icon);
            }
        })
        //暂停图标的点击播放视频事件
        icon.on('click',function(e){
            play(video,icon);
            e.stopPropagation();
        })
    })
}
/**
 * 帮助中心框高自适应
 */
var helpBoxControl = function(){
    var helpBoxs = $('.help-box');
    var width = getPageWidth();
    helpBoxs.each(function(){
        var height = width*0.65;
        $(this).css({
            height: height
        })
    })
}
/**
 * 折叠菜单
 */
var foldMenu = function(){
    menu.animate({
        left: '-50%'
    },250);
    nav.animate({
        left: '0'
    },250);
    main.animate({
        left: '0'
    },250);
    ifFolded = true;
}
/**
 * 展开菜单
 */
var unfoldMenu = function(){
    menu.animate({
        left: '0'
    },250);
    main.animate({
        left: '50%'
    },250);
    nav.animate({
        left: '50%'
    },250);
    ifFolded = false;
    document.addEventListener('touchmove',function(e){
        if(!ifFolded){
            e.preventDefault();
        }
    },false)
}
/**
 * 医院详情 图片滚动事件
 */
var detailSlide = function(){
    var width = top.document.documentElement.clientWidth ? top.document.documentElement.clientWidth:top.document.body.clientWidth;
    width = (width*0.8)/4;
    detailScroll.find('li').on('click',function(){
        var background = $(this)[0].style.background;
        detailBigImg.css({
            background: background+' no-repeat',
            '-webkit-background-size': 'cover',
            backgroundSize: 'cover'
        })
    });
    detailScroll.find('span.prev').on('click',function(){
        myScroll.scrollBy(width, 0, 500, IScroll.utils.ease.quadratic);
    });
    detailScroll.find('span.next').on('click',function(){
        myScroll.scrollBy(-width, 0, 500, IScroll.utils.ease.quadratic);
    });
}
/**
 * 医院详情 图片自适应
 */
var detailResize = function(){
    var width = top.document.documentElement.clientWidth ? top.document.documentElement.clientWidth:top.document.body.clientWidth;
    var height,sHeight,tHeight;
    var prev = detailScroll.find('span.prev');
    var next = detailScroll.find('span.next');
    var smallImgs = detailScroll.find('li');
    var wrapper = $('#wrapper');
    var scroller = $('#scroller');

    width = width*0.8;
    wrapper.css({ width: width });

    height = width/1.26;
    sHeight = height/4.375;
    tHeight = height+15;
    detailBigImg.css({ height: height});
    prev.css({
        marginTop: tHeight,
        height: sHeight-5,
        paddingTop: sHeight/2-5
    });
    next.css({
        marginTop: tHeight,
        height: sHeight-5,
        paddingTop: sHeight/2-5
    });
    detailScroll.css({ height: sHeight });
    scroller.css({ width: (width/4)*smallImgs.length });
    smallImgs.css({
        width: (width-60)/4,
        height: sHeight
    });
}
$('#menu').on('click',function(e){
    if(ifFolded){
        unfoldMenu();
        main.on('click',foldMenu);
    }else{
        foldMenu();
        main.off('click');
    }
    e.stopPropagation();
});
$('#dropdownMenu1').on('click',function(){
    $(this).children('.glyphicon').toggleClass('glyphicon-menu-down glyphicon-menu-up');
})
/**
 * 头部图片高度定义
 */
$(function(){
    $('div.banner,div.banner>.cover').css({
        height: getPageWidth()
    })
})
$(window).on('resize',function(){
    $('div.banner,div.banner>.cover').css({
        height: getPageWidth()
    })
})
